<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib uri="/WEB-INF/aitag.tld" prefix="ai"%>   
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
<jsp:include page="${ctx}/css_inc"></jsp:include> 
<meta http-equiv="X-UA-Compatible" content="edge" /> 

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>每日营销总量设置</title>
</head>

<body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight">
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
					<div class="ibox-title">
						<h5>每日营销总量设置</h5>
					</div>
					<div class="ibox-content">
					 	<div class="row">
							<div class="col-lg-12">
								<form role="form" class="form-inline">
									<div class="form-group">
										<div class="input-group">
											<span class="input-group-addon">限制目标类型</span> 
											<select class="form-control" id="targetType">
												<option value="">请选择限制目标</option>
												<option value="CHANNEL" >渠道</option>
												<option value="POINT" >触点</option>
											</select>
										</div>
									</div>
									<div class="form-group">
										<div class="input-group">
											<span class="input-group-addon">限制目标</span> 
											<input id="channelId" name="channelId" class=" form-control tree-select" >
											<input id="pointId" name="pointId" class=" form-control tree-select" style="display:none">
										</div>
									</div>
									<button id="queryBtn" class="btn btn-primary" type="button">
										<i class="fa fa-search"></i>&nbsp;搜索
									</button>
								</form>
							</div>
						</div>
					 	
					 	<div class="hr-line-dashed"></div>
							<div> 
								<div>
									<button id="btnAdd" class="btn  btn-white " type="button">
										<i class="fa fa-plus"></i>&nbsp;添加
									</button>
								</div>
								<table id="dayLimitTable" data-height="452" data-mobile-responsive="true">
								</table>
							</div>
					   </div>
				   </div>
				</div>
		  </div>
	</div>
	<jsp:include page="${ctx}/js_inc"></jsp:include>
	<ai:DSStaticData fields="DAY_LIMIT_CFG_TARGET_TYPE"/>
	<script type="text/javascript">
	    var channelData = ${channelData};
	    var pointData = ${pointData};
	  
	
		var channelTree;//下拉渠道tree
		var pointTree;//下拉触点tree
		
		
		$().ready(function() {
			$.post('${ctx}/contactmgn/point/getChannelTree', 
	    			function (data) {
						if(data.success){
							channelTree = data.obj;  
					}}
	    	); 
			$.post('${ctx}/contactmgn/point/getPointTree', 
	    			function (data) {
				     	 if(data.success){
				    	  	pointTree = data.obj;  
					}}
	    	);  
		});
		
		
		$('#targetType').change(function(){  
			var targetType=$('#targetType').val();
			
			$('#pointId').data('value','');
			$('#pointId').val(''); 
			
			$('#channelId').data('value','');
			$('#channelId').val(''); 
			if (targetType != null && targetType != '') {
				
				if (targetType == 'CHANNEL') {
					$('#pointId').hide();
					$('#channelId').show();
				}
				if (targetType == 'POINT') {
					$('#channelId').hide();
					$('#pointId').show();
				}
			}
		});
		
		$('#pointId').click(function(){
			if (isNotNull($('#targetType').val())) {
				treeSelect(this,pointTree,true,true);
			}
			return false;
		});
		
		$('#channelId').click(function(){
			if (isNotNull($('#targetType').val())) {
				 treeSelect(this,channelTree,true);
			}
			return false;
		});
		
		
		function pointIdonClick(e, treeId, treeNode) { 
			var obj = $('#pointId');
	  		obj.val(treeNode.name);  
			obj.data('value',treeNode.id); 
			$('#targetId').val(treeNode.id);  
		}
		
		function pointIdbeforeClick(treeId, treeNode, clickFlag){
	 		var check = (treeNode && !treeNode.parent);
			if (!check) alert("只能选择触点...");
			return check; 
		}
		
		function channelIdonClick(e, treeId, treeNode) {
			var obj = $('#channelId');
	  		obj.attr('value', treeNode.name);
			obj.data('value',treeNode.id); 
		}
		
		
		
		/* 用于查询按钮 */
		$('#queryBtn').click(
			function() {$('#dayLimitTable').bootstrapTable('refresh');
		});
		
	 
		
		$('#dayLimitTable').bootstrapTable({
			columns : [ {
				field : 'limitId',
				title : '名单ID',
				sortable : true,
				halign : 'center', 
				align : 'center',
				visible : false 
			}, {
				field : 'targetType',
				title : '限制目标类型',
				halign : 'center', 
				align : 'center',
				formatter : function(value, row,index) {
					return valueFormat(value,daylimitcfgtargettype); 
				}
			}, {
				field : 'targetId',
				title : '限制目标',
				halign : 'center', 
				align : 'center',
				formatter : function(value, row,index) {
					if (row.targetType == 'CHANNEL') {
						return valueFormat(value,channelData);
					}else if (row.targetType == 'POINT') {
						return valueFormat(value,pointData);
					} else {
						return value;
					} 
				} 
			}, {
				field : 'limitValue',
				title : '限制值',
				halign : 'center', 
				align : 'center'
			}, {
				field : 'operate',
				title : '操作',
				width : '150px',
				halign : 'center',  
				align : 'center',
				formatter : function(value, row, index) {
					var html = '<a href="javascript:;" onclick="edit('+row.limitId+')" title="编辑"><i class="fa fa-pencil text-navy"></i></a>&nbsp;'; 
					html +='<a href="javascript:;" onclick="del('+row.limitId+')" title="删除"><i class="fa fa-trash-o text-danger"></i></a>'; 
					return html;
				}
			} ],
			classes :'table table-hover',   
			uniqueId :'limitId',  
			idField :'limitId',  
			sortName : 'limitId', 
			sortOrder : 'asc',
			pagination : true,  
			sidePagination : 'server', 
			clickToSelect : true, 
			pageNumber : 1, 
			pageSize : 10,
			pageList : [  10, 20 ],
			queryParamsType : '',
			queryParams : function(params) {
				var targetId ;
				var targetType =  $('#targetType').val();
				if(targetType == 'CHANNEL'){
					targetId = $('#channelId').data('value');
				}
				if(targetType == 'POINT'){
					targetId = $('#pointId').data('value');
				}
				return {  
 					targetType : targetType,
 					targetId : targetId, 
 					pageNumber : params.pageNumber, 
					pageSize : params.pageSize, 
					sort : params.sortName,
					order : params.sortOrder,	
				}
			},
			url : '${ctx}/contactmgn/point/queryDaylimitCfg'
		});
	
	  
		/*进行删除的操作  */
	  function del(limitId){
			   swal({
			        title: '您确定要删除这条信息吗?',
			        text: '删除后将无法恢复，请谨慎操作！',
			        type: 'warning',
			        showCancelButton: true,
			        confirmButtonColor: '#ed5565', 
			        closeOnConfirm: false
			    }, function () {
			    	$.post('${ctx}/contactmgn/point/delDayLimitCfg', { limitId: limitId }, 
			    			function (data) { 
			    				if(data.success){
			    					 swal('删除成功！', '您已经永久删除了这条信息。', 'success');
			    					 $('#dayLimitTable').bootstrapTable('refresh');
			    				}else{
			    					 swal('删除失败！', data.msg, 'warning');
			    				}
			    			}
			    	); 
			    });
		}
	 
		var layerIndex;
		$('#btnAdd').click(
			function() {
				openLayer('每日营销总量设置新增','${ctx}/contactmgn/point/daylimitcfg'); 
			}			
		);
		
		function edit(limitId){ 
			openLayer('每日营销总量设置修改','${ctx}/contactmgn/point/daylimitcfg?limitId='+limitId);
		}
		
		function openLayer(title,url){
			layerIndex = layer.open({
				type : 2,
				title : title,
				btn : [ '确认', '关闭' ], 
				yes : function() {
					var ifnameName = 'layui-layer-iframe' + layerIndex;
					var iFrame = window.frames[ifnameName].document;
					
					var object = $.serializeObject($('#dataForm', iFrame));   /* 此处拿到的object表示form表单的内容 */
				 
					var rtn = window.frames[ifnameName].$('#dataForm').validate().form();
					if(rtn){
						$.post('${ctx}/contactmgn/point/saveDayLimitCfg', object, 
				    			function (data) { 
					        		layer.close(layerIndex);
				    				if(data.success){ 
				    					 swal('保存成功！', '', 'success');
				    					 $('#dayLimitTable').bootstrapTable('refresh');
				    				}else{
				    					 swal('保存失败！', data.msg, 'warning');
				    				}
				    			}
				    	); 
					}  
				},
				shadeClose : true, //点击遮罩关闭层
				area : [ '800px','500px'  ],
				content : url
				});
		}
	</script>
</body>

</html>
